let storage = bui.storage();
let orgMap = new Map()
let org;
let language,translate;
loader.define(function (require, exports, module, global) {
    let pageview = {
        init() {
            translate = global.translate
            language = storage.get("language", 0)
            if (!language) {
                language = 'chinese_simplified'
            }

            try {
                translate.selectLanguageTag.show = false;
                let curLanguage = translate.language.getCurrent()
                if (curLanguage !== language) {
                    translate.changeLanguage(language)
                }
                translate.execute();
            }catch (e) {
                console.log("切换语言报错")
            }
            if (language !== "chinese_simplified") {
                router.$("#mqText").css('font-size', '.32rem')
                router.$("#zd").css('font-size', '.22rem')
            } else {
                router.$("#mqText").css('font-size', '.4rem')
                router.$("#zd").css('font-size', '.3rem')
            }

            let uiLoading = bui.loading({
                appendTo:"#countryLoading",
                width: 40,
                height: 40,
                opacity: 0.5,
                autoClose: false,
                text:"加载中。。。",
                callback: function (argument) {
                }
            });
            // uiLoading.show()

            router.$("#countryFh").click(function () {
                storage.set("tzPage", 0)
                router.replace({url: "pages/mainIndex/mainIndex.html"});
            })

            orgMap = new Map()
            org = storage.get("org",0)
            if (org != null) {
                router.$("#zd").html(org.description)
            }
            let data = storage.get("countryList", 0)

            if (!data) {
                uiLoading.show()
                // 查询需要缓存数据
                bui.ajax({
                    url: global.api.getCountryTermList,
                    method: "POST"
                }).then(function(res){
                    let data = res.data
                    if (data){
                        let country = data.country
                        let countryList = []
                        country.forEach(coun => {
                            if (coun.children && coun.children.length > 0) {
                                countryList.push({id: coun.id, description: coun.description})
                                storage.set("country" + coun.id, coun.children)
                            }
                        })
                        setting(countryList, global)
                        storage.set("countryList", countryList)
                        let term = data.term
                        let termList = []
                        term.forEach(ter => {
                            if (ter.children && ter.children.length > 0) {
                                termList.push({id: ter.id, name: ter.name})
                                storage.set("term" + ter.id, ter.children)
                            }
                        })
                        storage.set("termList", termList)
                        uiLoading.hide()
                    }
                })
            } else {
                setting(data, global)
            }


            // bui.ajax({
            //     url: global.api.getCountryList,
            //     data: {type: '2'},
            //     method: "POST"
            // }).then(function(res){
            //     let data = res.data
            //     if (data) {
            //         let html = ""
            //         data.forEach((da, index) => {
            //             if ((org == null && index == 0) || (org != null && org.parent == da.id)) {
            //                 html += '<div class="tab" name="'+index+'" id="'+da.id+'" style="border-left: red 2px solid; background-color: white">\n'+
            //                     '           <p id="tabLabel'+index+'" class="tabLabel" style="color: red">'+da.description+'</p>\n'
            //                 getCity(da.id, global.api.getCountryList)
            //             } else {
            //                 html += '<div class="tab" name="'+index+'" id="'+da.id+'">\n'+
            //                     '           <p id="tabLabel'+index+'" class="tabLabel">'+da.description+'</p>\n'
            //             }
            //             html += '     </div>'
            //         })
            //         router.$("#list").html(html)
            //
            //         router.$(".tab").click(function () {
            //             let id = router.$(this).attr("id")
            //             let xh = router.$(this).attr("name")
            //
            //             if(router.$("#tabLabel" + xh).css('color') != 'red') {
            //                 // uiLoading.show()
            //                 router.$(".tab").css({
            //                     'border-left': 0,
            //                     'background-color': '#D6D6D6'
            //                 });
            //                 router.$(".tabLabel").css({
            //                     'color': 'black'
            //                 });
            //
            //                 router.$(this).css({
            //                     'border-left': 'red 2px solid',
            //                     'background-color': 'white'
            //                 })
            //                 router.$("#tabLabel" + xh).css({
            //                     'color': 'red'
            //                 })
            //
            //                 getCity(id, global.api.getCountryList, uiLoading)
            //             }
            //         })
            //     }
            //     uiLoading.stop()
            // })
        }
    };

    // 初始化
    pageview.init();

    // 输出模块
    return pageview;
})

function getCity(id, url) {
    let data = storage.get("country" + id, 0)
    let html = ""
    if (data) {
        let fontSize = '15px'
        if (language !== "chinese_simplified") {
            fontSize = '0.2rem'
        }
        data.forEach((r,index) => {
            orgMap.set(r.id+"", r)
            if (index % 3 == 0) {
                if (index == 0) {
                    html += '<div class="bui-box" style="height: 100%">'
                } else {
                    html += '</div><div class="bui-box" style="height: 100%">'
                }
            }

            if (org != null && org.id == r.id) {
                html += '<div class="span1 countryImg" id="'+r.id+'">'+
                    // '<img src="'+r.imgUrl+'" width="100px" height="50px"/>' +
                    '<p class="cityText" style="color: red;font-size: '+fontSize+'">'+r.description+'</p></div>'
            } else {
                html += '<div class="span1 countryImg" id="'+r.id+'">'+
                    // '<img src="'+r.imgUrl+'" width="100px" height="50px"/>' +
                    '<p class="cityText" style="font-size: '+fontSize+'">'+r.description+'</p></div>'
            }
        })
        let len = data.length
        if (len % 3 != 0) {
            for (let i = 0; i < 3-(len%3); i++) {
                html += '<div class="span1"></div>'
            }
        }
        html += "</div>"
    }
    router.$("#country1").html(html)
    router.$(".countryImg").click(function () {
        let id = $(this).attr("id")
        storage.set("org",orgMap.get(id))
        storage.set("tzPage", 0)
        router.replace({url: "pages/mainIndex/mainIndex.html"});
    })
    try {
        translate.execute();
    }catch (e) {
        console.log("切换语言报错")
    }

    // bui.ajax({
    //     url: url,
    //     data: {parent: parseInt(id)},
    //     method: "POST"
    // }).then(function(res){
    //     let data = res.data
    //     let html = ""
    //     if (data) {
    //         data.forEach((r,index) => {
    //             orgMap.set(r.id+"", r)
    //             if (index % 3 == 0) {
    //                 if (index == 0) {
    //                     html += '<div class="bui-box" style="height: 100%">'
    //                 } else {
    //                     html += '</div><div class="bui-box" style="height: 100%">'
    //                 }
    //             }
    //
    //             if (org != null && org.id == r.id) {
    //                 html += '<div class="span1 countryImg" id="'+r.id+'">'+
    //                     // '<img src="'+r.imgUrl+'" width="100px" height="50px"/>' +
    //                     '<p style="color: red">'+r.description+'</p></div>'
    //             } else {
    //                 html += '<div class="span1 countryImg" id="'+r.id+'">'+
    //                     // '<img src="'+r.imgUrl+'" width="100px" height="50px"/>' +
    //                     '<p>'+r.description+'</p></div>'
    //             }
    //         })
    //         let len = data.length
    //         if (len % 3 != 0) {
    //             for (let i = 0; i < 3-(len%3); i++) {
    //                 html += '<div class="span1"></div>'
    //             }
    //         }
    //         html += "</div>"
    //     }
    //     router.$("#country1").html(html)
    //     router.$(".countryImg").click(function () {
    //         let id = $(this).attr("id")
    //         storage.set("org",orgMap.get(id))
    //         storage.set("tzPage", 0)
    //         router.replace({url: "pages/mainIndex/mainIndex.html"});
    //     })
    //     if (uiLoading) {
    //         uiLoading.stop()
    //     }
    // })
}

function setting(data, global) {
    let html = ""
    let fontSize = '15px'
    if (language !== "chinese_simplified") {
        fontSize = '0.18rem'
    }
    data.forEach((da, index) => {
        if ((org == null && index == 0) || (org != null && org.parent == da.id)) {
            html += '<div class="tab" name="'+index+'" id="'+da.id+'" style="border-left: red 2px solid; background-color: white">\n'+
                '           <p id="tabLabel'+index+'" class="cityText" style="color: red; font-size: '+fontSize+'">'+da.description+'</p>\n'
            getCity(da.id, global.api.getCountryList)
        } else {
            html += '<div class="tab" name="'+index+'" id="'+da.id+'">\n'+
                '           <p id="tabLabel'+index+'" class="cityText" style="font-size: '+fontSize+'">'+da.description+'</p>\n'
        }
        html += '     </div>'
    })
    router.$("#list").html(html)
    try {
        translate.execute();
    }catch (e) {
        console.log("切换语言报错")
    }

    router.$(".tab").click(function () {
        let id = router.$(this).attr("id")
        let xh = router.$(this).attr("name")

        if(router.$("#tabLabel" + xh).css('color') != 'red') {
            // uiLoading.show()
            router.$(".tab").css({
                'border-left': 0,
                'background-color': '#D6D6D6'
            });
            router.$(".cityText").css({
                'color': 'black'
            });

            router.$(this).css({
                'border-left': 'red 2px solid',
                'background-color': 'white'
            })
            router.$("#tabLabel" + xh).css({
                'color': 'red'
            })

            getCity(id, global.api.getCountryList)
        }
    })
}

